<template>
  <div class="padding-y-15 padding-x-30">
    
      <a-form
        :label-col="{ md: { span: 2 }, sm: { span: 4 }, xs: { span: 24 } }"
        :wrapper-col="{ md: { span: 22 }, sm: { span: 20 }, xs: { span: 24 } }"
      >
        <a-row :gutter="24">
			<a-col :md="8" :sm="12" :xs="10" style="height: calc(100vh - 120px);background-color:#fff;">
				<div class="flex align-center padding-15">
					<a-avatar :size="40">
						<template #icon>
							<UserOutlined />
						</template>
					</a-avatar>
					<a-input-search
						class="flex1 fs-12 margin-x-10"
						placeholder="会员手机（支持后4为）"
					/>
					<div class="add-btn flex align-center justify-center">+</div>
				</div>
				<div>
					<vxe-table align="center" :data="tableData">
						<vxe-column field="首饰销售" title="首饰销售"></vxe-column>
						<vxe-column field="实付金额（元）" title="实付金额（元）"></vxe-column>
						<vxe-column field="操作" title="操作"></vxe-column>
					</vxe-table>
					<vxe-table align="center" :data="tableData">
						<vxe-column field="首饰销售" title="首饰销售"></vxe-column>
						<vxe-column field="实付金额（元）" title="实付金额（元）"></vxe-column>
						<vxe-column field="操作" title="操作"></vxe-column>
					</vxe-table>
				</div>
			</a-col>
			<a-col :md="16" :sm="12" :xs="14"  style="height: calc(100vh - 120px);background-color:#fff;padding-left:0;padding-right:0;">
				<a-row :gutter="24">
					<a-col :md="8" :sm="8" :xs="8">
						<a-form-item label="主销导购">
						  <a-select
						    optionFilterProp="label"
						    allow-clear
						    placeholder="请选择"
						  >
						  </a-select>
						</a-form-item>
					</a-col>
					<a-col :md="8" :sm="8" :xs="8">
						<a-form-item label="辅销导购">
						  <a-select
						    optionFilterProp="label"
						    allow-clear
						    placeholder="请选择"
						  >
						  </a-select>
						</a-form-item>
					</a-col>
					<a-col :md="8" :sm="8" :xs="8">
						<a-form-item label="消费动机">
						  <a-select
						    optionFilterProp="label"
						    allow-clear
						    placeholder="请选择"
						  >
						  </a-select>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row :gutter="24">
					<a-col :md="8" :sm="8" :xs="8">
						<a-form-item label="销售班组">
						  <a-radio-group>
						      <a-radio value="large">A</a-radio>
						      <a-radio value="middle">B</a-radio>
						      <a-radio value="small">C</a-radio>
						    </a-radio-group>
						</a-form-item>
					</a-col>
					<a-col :md="8" :sm="8" :xs="8">
						<a-form-item label="客户来源">
						  <a-radio-group>
						      <a-radio value="large">自然</a-radio>
						      <a-radio value="middle">活动</a-radio>
						      <a-radio value="small">激活</a-radio>
						      <a-radio value="small">老带新</a-radio>
						    </a-radio-group>
						</a-form-item>
					</a-col>
					<a-col :md="8" :sm="8" :xs="8">
						<a-form-item label="备注">
						  <a-select
						  style="width:80%"
						    optionFilterProp="label"
						    allow-clear
						    placeholder="请选择"
						  >
						  </a-select>
						  <img
						    src="@/assets/set.png"
						    style="width: 30px; height: 30px; margin-left: 20px; cursor: pointer"
						  />
						</a-form-item>
					</a-col>
				</a-row>
			</a-col>
        </a-row>
      </a-form>
    
  </div>
</template>

<script setup>
  import { ref, reactive, onMounted } from 'vue';
  import { UserOutlined, PlusSquareOutlined } from '@ant-design/icons-vue';
  import { Modal, message } from 'ant-design-vue';
  import { useRouter } from 'vue-router';
  import zbTable from './components/table.vue';
  import log from './components/log.vue';
  import {
    member_level_get_setting,
    member_level_setting
  } from '@/api/member/get_setting'; 
  
  const tableData = ref([]);
</script>
